import { Component } from '@angular/core';

@Component({
  selector: 'app-zero',
  templateUrl: './zero.component.html',
  styleUrls: ['./zero.component.css'],
})
export class ZeroComponent {
  count: number = 0;
  // 1.constructor 构造方法，组件创建时触发
  constructor() {
    console.log('组件constructor');
  }
  // 2.ngOnChanges 组件绑定的属性值发生变化时触发
  ngOnChanges() {
    console.log('组件ngOnChanges');
  }
  // 3. ngOnInit 初始化指令/组件。初始化完毕。等价于mounted
  // 用于加载数据
  ngOnInit() {
    console.log('组件ngOnInit');
  }
  // 4.ngDoCheck 组件检查到了系统对自己的影响
  //  Angular 无法或不愿意自己检测的变化
  ngDoCheck() {
    console.log('组件ngDoCheck');
  }
  // 5. ngAfterContentInit 组件的内容初始化完成
  ngAfterContentInit() {
    console.log('组件ngAfterContentInit');
  }
  // 6.组件的内容发生变化需要检查
  ngAfterContentChecked() {
    console.log('组件ngAfterContentChecked');
  }
  // 7.视图初始化
  ngAfterViewInit() {
    console.log('组件ngAfterViewInit');
  }
  // 8.组件的视图发生变化需要检查
  ngAfterViewChecked() {
    console.log('组件ngAfterViewChecked');
  }
  // 9.组件销毁，即将从DOM树上卸载，资源释放
  ngOnDestroy() {
    console.log('组件ngOnDestroy');
  }
  btnClick() {
    this.count++;
  }
}
